<template>
  <div id="app">
    <div class="container">
      <div class="cart justify-content-center">
              <!-- 头部 -->
            <CartHeader/>     
       <div class="tab-content mt-1">
              <!-- 商品界面 -->
            <GoodsList/>
              <!-- 最近删除界面 -->
            <DeleteList/>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import GoodsList from "./components/GoodsList";
import DeleteList from "./components/DeleteList";
import CartHeader from "./components/CartHeader";
import bgImg from '../public/img/home-bg.jpg'
export default {
  name: "App",
  components: {
    GoodsList,
    DeleteList,
    CartHeader
  },
  methods:{
    
  }
};
</script>

<style>
body::before{
 content: "";
	position: absolute;
	left: 0;
	top: 0;
  width: 100%;
  height: 100%;
	z-index: -1;  /*放在内容背后*/
	/* background: url(../public/img/home-bg.jpg); */
	background-size: cover;
	opacity: 0.3;  /*透明度*/
}
/* 商品元组图片高度 */
.pic {
  height: 100px;
}
/* 两个全选按钮 */
.cart-all,
.cart-all2 {
  cursor: pointer;
}
/* 底部字体 */
#mytotal {
  font-size: 2rem;
}

ul,
li {
  list-style: none;
}

.cart-del:hover,
.cart-add-single:hover {
  color: rgb(16, 155, 165);
  cursor: pointer;
  background-color: #fff;
  border-color: #fff;
}

tbody img {
  float: left;
}

.nav-link {
  color: #17a2bc;
}
</style>
